import { Component } from 'react'

export default class Profile extends Component {
  // 声明类组件状态数据
  // state = {
  //   myName: "大牧"
  // }

  // constructor中声明状态数据
  constructor() {
    super()
    // 声明类组件的状态数据
    this.state = {
      myName: "大牧",
      myAge: 18
    }
  }

  render () {
    return (
      <>
        <h3>组件状态数据管理</h3>
        <p>1、声明位置：可以在类内部、方法外部，使用变量state声明</p>
        <p>2、声明位置：可以在constructor构造函数中，使用变量state声明(推荐)</p>
        <p>3、访问状态数据：可以通过this.state进行数据的访问</p>
        <p>姓名：{this.state.myName}</p>
        <p>年龄：{this.state.myAge}</p>
      </>
    )
  }
}
